// 1.加载路由模块
import VueRouter from 'vue-router';
// 2.为项目安装路由功能
import Vue from 'vue';

//返回的VueRouter为一个构造函数，定义了VueRouter.install()方法
Vue.use(VueRouter);

import HomeBox from '../views/HomeBox';
// import FilmBox from '../views/FilmBox';
// import DetailBox from '../views/DetailBox';
// import NotFound from '../views/NotFound';
// 3.创建路由对象，配置项目中参与路由控制的相关组件
const router = new VueRouter({
    mode:"hash",
    routes:[
        {
            path:"",
            redirect:"/home"
        },
        {
            path:"/home",
            component:HomeBox,
            //存放当前激活路由的元信息（自定义信息）
            meta:{
                name:"home",
                backBtn:true
            }
        },
        {
            path:"/films",
            name:"films",
            // component:FilmBox
            component:() => import(/*webpackChunkName: "films" */ '../views/FilmBox.vue'),
            meta:{
                name:"films"
            }
        },
        {
            // path:"/detail",
            // path:"/detail/:filmId",
            //问好表示可传可不传
            path:"/detail/:filmId/:aaa?",
            name:"details",
            // component:DetailBox
            component:() => import(/* webpackChunkName: "detail" */ '../views/DetailBox.vue'),
            meta:{
                name:"detail",
                showBottom:true
            }
        },
        {
            path:"*",
            // component:NotFound
            component:() => import(/* webpackChunkName: "notFound" */ '../views/NotFound.vue'),

        }
    ]
});

// 4.对外公开路由功能

export default router;

/*
5、将路由对象和项目跟容器进行功能对接
    new Vue({
        router,
        render: h => h(App),
    }).$mount('#app')
*/
